import React, { FC } from 'react'
import style from './article.module.scss'
import { Carousel } from 'antd'
import Recommend from '@/component/recommend'
import Tags from '@/component/Tags'

const contentStyle: React.CSSProperties = {
  margin: 0,
  height: '160px',
  color: '#fff',
  lineHeight: '160px',
  textAlign: 'center',
  background: '#364d79'
}

const Article: FC = () => {
  // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
  const onChange = (currentSlide: number) => {
    console.log(currentSlide)
  }
  return (
    <div className={style.context}>
      <div className={style.left}>
        <div className={style.carousel}>
          <Carousel afterChange={onChange}>
            <div className="w100">
              <h3 style={contentStyle}>1</h3>
            </div>
          </Carousel>
        </div>
      </div>
      <div className={style.right}>
        <Recommend />
        <Tags />
      </div>
    </div>
  )
}

export default Article
